import utils from '@/mixins/utils.js';
import parkinglotMixin from '@/mixins/parkingLot/parkinglotInfo.js';
export default {
	mixins: [parkinglotMixin, utils],
	props: ['oldParkBaseInfo', 'areaLevelOne'],
	name: 'parkingLotInfo',
	data() {
		return {
			parkBaseInfo: {
				address: '',
				areaFullPath: '',
				areaID: '',
				areaName: '',
				chargePicChangeFlag: false,
				chargeRulePicStr: '',
				chargeRulePicType: '',
				chargeRulePicUrl: '',
				customParkCode: '',
				flagTag: '',
				freeTime: '',
				fullPath: '',
				gpsX: '',
				gpsY: '',
				id: null,
				isTemplatePay: false,
				isTradecouponOnlinesettle: false,
				name: '',
				parkCode: '',
				parkType: 0,
				parkingSupervisor: '',
				parkingSupervisorPhone: '',
				partWay: 0,
				picChangeFlag: false,
				picPath: '',
				picStr: '',
				picType: '',
				pkGlobalid: '',
				slotsNumber: '',
				tempCarports: '',
				timeoutLength: '',
				parkSysType: 0,
				uiOpt: {
					parkinglotImgfileList: [],
					chargeRuleImgList: [],
					protocolList: [],
					gpsXY: '',
					areaAreaData: [[], [], []],
					areaSelected: ['', '', ''],
					defaultProvince: '',
					protocolKey: ''
				}
			}
		};
	},
	created() {
		if (this.oldParkBaseInfo) {
			this.parkBaseInfo = this.oldParkBaseInfo;
		}
		if (!this.parkBaseInfo.uiOpt.areaAreaData[0].length) {
			this.getAreaLv1();
		}
	},
	methods: {
		checkIsParkNameRepeat(val) {
			return new Promise((resolve, reject) => {
				API.fetchGet('/operatorPark/hasExistParkName', {
					parkName: val
				}).then(
					res => {
						resolve(true);
					},
					err => {
						reject(err.data.message);
					}
				);
			});
		},

		async handleChange(file, fileList) {
			const isJPG = file.raw.type === 'image/jpeg' || file.raw.type === 'image/png';
			const isLt900K = file.raw.size / 1024 / 1024 < 0.87;
			if (!isJPG) {
				this.showToast('上传图片只能是 JPG 格式或者 PNG 格式!', 0, 2000);
			}
			if (!isLt900K) {
				this.showToast('上传图片大小不能超过 900K!', 0, 2000);
			}

			if (isJPG && isLt900K) {
				this.parkBaseInfo.uiOpt.parkinglotImgfileList = fileList.slice(-1);
				const imgData = await this.getUploadImgData(file);
				this.parkBaseInfo.uiOpt.parkinglotImgfileList[0].url = imgData.base64Str;
				this.parkBaseInfo.picStr = imgData.base64Str.split(',')[1];
				this.parkBaseInfo.picType = imgData.imgType;
			} else {
				this.parkBaseInfo.uiOpt.parkinglotImgfileList = [];
				this.parkBaseInfo.picStr = '';
				this.parkBaseInfo.picType = '';
			}
		},
		protocolHandleChange(file, fileList) {
			this.parkBaseInfo.uiOpt.protocolList = fileList.slice(-1);
			this.$refs.protocolUpload.submit();
		},
		protocolUploadSuccess(res) {
			this.parkBaseInfo.uiOpt.protocolKey = res;
			this.$refs.parkBaseInfo.validateField('uiOpt.protocolKey');
		},
		protocolRemove() {
			this.parkBaseInfo.uiOpt.protocolKey = '';
			this.$refs.parkBaseInfo.validateField('uiOpt.protocolKey');
		},
		getUploadImgData(file) {
			return new Promise((resolve, reject) => {
				const reader = new FileReader();
				const self = this;
				reader.readAsDataURL(file.raw);
				reader.onload = e => {
					const result = {
						base64Str: e.target.result,
						imgType: file.raw.type.split('/')[1]
					};
					resolve(result);
				};
			});
		},
		showParkinglotImg() {
			API.fetchGet('/operatorPark/getOperatorParkPicTemplateUrl').then(res => {
				window.open(res.message);
			});
		},

		downloadParkinglotProtocol() {
			API.fetchGet('/operatorPark/getOperatorParkProtocolTemplateUrl').then(res => {
				window.open(res.data);
			});
		},

		selectMapPoint() {},

		goBackStep() {
			this.$emit('setFormData', 'parkBaseInfo', this.parkBaseInfo);
			this.$emit('goBackSetp');
		},
		goNextStep(formName) {
			this.$refs[formName].validate(valid => {
				if (valid) {
					console.log('valid');
					this.$emit('setFormData', 'parkBaseInfo', this.parkBaseInfo);
					this.$emit('goNextStep');
				} else {
					console.log('error!!');
					return false;
				}
			});
		}
	}
};
